{% extends "base.html" %}

{% block title %}{{ course.name }} - 万岛潜水{% endblock %}

{% block content %}
<div class="container">
    <div class="row mb-4">
        <div class="col-12">
            <nav aria-label="breadcrumb">
                <ol class="breadcrumb">
                    <li class="breadcrumb-item"><a href="{{ url_for('main.index') }}">首页</a></li>
                    <li class="breadcrumb-item"><a href="{{ url_for('main.courses') }}">潜水课程</a></li>
                    <li class="breadcrumb-item active" aria-current="page">{{ course.name }}</li>
                </ol>
            </nav>
        </div>
    </div>
    
    <div class="row mb-5">
        <div class="col-md-8">
            <h1 class="mb-4">{{ course.name }}</h1>
            <div class="card shadow-sm mb-4">
                <img src="{{ url_for('static', filename='uploads/' + course.image) }}" class="card-img-top" alt="{{ course.name }}">
                <div class="card-body">
                    <h5 class="card-title">课程介绍</h5>
                    <p class="card-text">{{ course.description }}</p>
                    
                    <h5 class="card-title mt-4">课程内容</h5>
                    {% if course.type == '体验潜水' %}
                    <ul>
                        <li>基础潜水理论讲解（约30分钟）</li>
                        <li>潜水装备使用说明</li>
                        <li>浅水区适应训练</li>
                        <li>水下呼吸和基本技能练习</li>
                        <li>教练带领探索珊瑚礁区（水下约30分钟）</li>
                        <li>水下拍照留念</li>
                    </ul>
                    {% elif course.type == '执证潜水' %}
                    <ul>
                        <li>潜水计划制定</li>
                        <li>装备检查和准备</li>
                        <li>船只出海到指定潜点</li>
                        <li>教练带领探索深水区域</li>
                        <li>观赏珊瑚礁和海洋生物</li>
                        <li>水下拍照和视频记录</li>
                    </ul>
                    {% elif course.type == '考证课程' %}
                    <ul>
                        <li>理论课程学习（潜水物理学、生理学、装备、环境等）</li>
                        <li>泳池训练（基本技能练习）</li>
                        <li>开放水域训练（4次海洋潜水）</li>
                        <li>理论考试和技能评估</li>
                        <li>证书申请和颁发</li>
                    </ul>
                    {% endif %}
                    
                    <h5 class="card-title mt-4">适合人群</h5>
                    {% if course.type == '体验潜水' %}
                    <p>适合10岁以上、身体健康的初次尝试潜水的朋友。无需任何潜水经验，会游泳更佳但不是必须。</p>
                    {% elif course.type == '执证潜水' %}
                    <p>适合持有潜水证书的潜水员。根据证书等级和经验，可以选择不同深度和难度的潜点。</p>
                    {% elif course.type == '考证课程' %}
                    <p>适合10岁以上、身体健康、会游泳的潜水爱好者。无需任何潜水经验，但需要通过健康评估。</p>
                    {% endif %}
                </div>
            </div>
            
            <div class="card shadow-sm">
                <div class="card-body">
                    <h5 class="card-title">注意事项</h5>
                    <ul>
                        <li>请提前24小时预约</li>
                        <li>活动当天请携带身份证和健康声明表</li>
                        <li>请自备泳衣和毛巾</li>
                        <li>如有特殊健康状况，请提前告知</li>
                        <li>恶劣天气可能导致活动取消或延期</li>
                    </ul>
                </div>
            </div>
        </div>
        
        <div class="col-md-4">
            <div class="card shadow-sm mb-4">
                <div class="card-body">
                    <h5 class="card-title">课程信息</h5>
                    <ul class="list-group list-group-flush">
                        <li class="list-group-item d-flex justify-content-between align-items-center">
                            课程类型
                            <span class="badge bg-primary rounded-pill">{{ course.type }}</span>
                        </li>
                        <li class="list-group-item d-flex justify-content-between align-items-center">
                            课程时长
                            <span>{{ course.duration }}</span>
                        </li>
                        <li class="list-group-item d-flex justify-content-between align-items-center">
                            价格
                            <span class="text-primary fw-bold">¥{{ course.price }}</span>
                        </li>
                    </ul>
                    <div class="d-grid gap-2 mt-3">
                        <a href="{{ url_for('main.booking', course_id=course.id) }}" class="btn btn-primary">立即预约</a>
                        <a href="{{ url_for('main.contact') }}" class="btn btn-outline-primary">咨询详情</a>
                    </div>
                </div>
            </div>
            
            <div class="card shadow-sm mb-4">
                <div class="card-body">
                    <h5 class="card-title">包含内容</h5>
                    <ul class="list-unstyled">
                        <li><i class="fas fa-check text-success me-2"></i>专业潜水装备</li>
                        <li><i class="fas fa-check text-success me-2"></i>专业教练指导</li>
                        <li><i class="fas fa-check text-success me-2"></i>保险</li>
                        <li><i class="fas fa-check text-success me-2"></i>水下照片</li>
                        {% if course.type == '执证潜水' %}
                        <li><i class="fas fa-check text-success me-2"></i>船只交通</li>
                        <li><i class="fas fa-check text-success me-2"></i>简易午餐</li>
                        {% elif course.type == '考证课程' %}
                        <li><i class="fas fa-check text-success me-2"></i>教材</li>
                        <li><i class="fas fa-check text-success me-2"></i>证书申请费</li>
                        <li><i class="fas fa-check text-success me-2"></i>潜水日志本</li>
                        {% endif %}
                    </ul>
                </div>
            </div>
            
            <div class="card shadow-sm">
                <div class="card-body">
                    <h5 class="card-title">推荐教练</h5>
                    <div class="row">
                        <div class="col-6 mb-3">
                            <img src="{{ url_for('static', filename='uploads/coach1.jpg') }}" class="img-fluid rounded-circle" alt="张教练">
                            <p class="text-center mt-2 mb-0">张教练</p>
                        </div>
                        <div class="col-6 mb-3">
                            <img src="{{ url_for('static', filename='uploads/coach2.jpg') }}" class="img-fluid rounded-circle" alt="李教练">
                            <p class="text-center mt-2 mb-0">李教练</p>
                        </div>
                        <div class="col-6">
                            <img src="{{ url_for('static', filename='uploads/coach3.jpg') }}" class="img-fluid rounded-circle" alt="王教练">
                            <p class="text-center mt-2 mb-0">王教练</p>
                        </div>
                        <div class="col-6">
                            <img src="{{ url_for('static', filename='uploads/coach4.jpg') }}" class="img-fluid rounded-circle" alt="赵教练">
                            <p class="text-center mt-2 mb-0">赵教练</p>
                        </div>
                    </div>
                    <div class="d-grid gap-2 mt-3">
                        <a href="{{ url_for('main.coaches') }}" class="btn btn-outline-primary">查看全部教练</a>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
{% endblock %} 